<template>
  <!-- @scroll.passive="scroll" -->
  <div class="List" ref="booklist">
    <div ref="resultlist" class="resultlist">
      <compTitle>{{ obj.name }}</compTitle>
      <cityCompList2
        :list="obj.list"
        :isAudio="isAudio"
        @gotoContent="gotoContent"
      ></cityCompList2>
    </div>
  </div>
</template>

<script>
import utils from "@/utils/utils.js";
import cityCompList2 from "@/components/cityCompList2";
import compTitle from "@/components/compTitle";
export default {
  props: {
    obj: {
      type: Object,
      default() {
        return null;
      },
    },
    isAudio: {
      type: Boolean,
      default: false,
    },
  },
  components: {
    cityCompList2,
    compTitle,
  },
  data() {
    return {};
  },
  methods: {
    gotoContent(obj) {
      this.$emit("gotoContent", {
        id: obj.id,
        title: obj.title,
      });
    },
    //节流
    // throttle(fn, wait) {
    //   let prev = 0; //上次记录的时间
    //   return function () {
    //     let now = Date.now();
    //     if (now - prev > wait) {
    //       fn.apply(this, arguments); //执行函数，发送请求
    //       prev = now;
    //     }
    //   };
    // },
    // scroll() {
    //   // console.log(this.$refs["booklist"].offsetHeight); //551
    //   // console.log(this.$refs["resultlist"].offsetHeight); //2129
    //   var scrollTop = this.$refs["booklist"].scrollTop;

    //   var listHeight = this.$refs["booklist"].clientHeight; //551
    //   var scrollHeight = this.$refs["resultlist"].scrollHeight; //2129
    //   // console.log(listHeight - (scrollHeight - scrollTop));
    //   let cha = listHeight - (scrollHeight - scrollTop);
    //   if (cha == 40) {
    //     console.log("到底了");
    //     this.$emit("loadMore");
    //   }
    // },
  },
  mounted() {
    // window.addEventListener("scroll", this.throttle(this.scroll, 3000));
  },
  deactivated() {
    // window.removeEventListener("scroll", this.throttle(this.scroll, 3000));
  },
};
</script>

<style lang="scss" scoped>
.List {
  width: 100%;
  height: 100%;
  overflow-y: auto;
}
.resultlist {
  width: 100%;
}
</style>
